<template>
  <div class="news">
     <Search placeholder="搜索" > </Search>
    <tabList :catelist="catelist" v-on:tabselect="tabselect" />
    <swiper :banlist="banlist" />
    <div class="newsList">
      <newList v-for="item of list" :key="item.id" :list="item" />
    </div>
    <div class="foot">
      <tabar :tabbarindex="tabbarindex" />
    </div>
  </div>
</template>

<script>
import { Search } from 'vux'
import { getcateLlist, getnewsban, getcate } from '@/api/news'
import tabar from '@/components/nav'
import newList from './components/newList'
import tabList from './components/tabList'
import swiper from './components/HomeSwipe'
export default {
  name: 'newspage',
  data () {
    return {
      tabbarindex: 1,
      list: [],
      catelist: [],
      banlist: [],
      cateid: '',
      search: ''
    }
  },
  components: {
    tabar,
    newList,
    tabList,
    swiper,
    Search
  },
  created () {
    this.getlist()
    this.tablist()
    this.getbanner()
  },
  methods: {
    tabselect (val) {
      console.log(val)
      this.cateid = val
      this.getlist()
    },
    getlist () {
      getcateLlist(this.cateid, this.search).then(res => {
        this.list = res.data
      })
    },
    tablist () {
      getcate().then(res => {
        this.catelist = res.data
      })
    },
    getbanner () {
      getnewsban().then(res => {
        console.log(res.data)
        this.banlist = res.data
      })
    }
  }
}
</script>

<style lang="stylus" scoped>
  .weui-search-bar
    background #fff
</style>
